<template>
  <div>
    <header>
      <a class="headerback" @click="go()">
        <img src="/img/back.png" />
      </a>
      <div class="indexsearch">{{ title }}</div>

      <router-link class="index" to="/home">
        <img src="/img/goindex.png" />
      </router-link>

      <!-- <a href="#/home" class="index">
        <img src="/img/goindex.png" />
      </a> -->
    </header>
  </div>
</template>

<script>
export default {
  data() {
    return {
      titleArr: [
        {
          name: "限时特卖",
          path: "/sale"
        },
        {
          name: "我的购物车",
          path: "/cart"
        },
        {
          name: "我的好乐买",
          path: "/user"
        },
        {
          name: "登录",
          path: "/login"
        },
        {
          name: "注册",
          path: "/reg"
        },
        {
          name: "我的收货地址",
          path: "/address"
        }
      ],
      title: ""
    };
  },

  components: {},

  methods: {
    getTitle() {
      this.titleArr.forEach(item => {
        if (item.path == this.$route.path) {
          this.title = item.name;
        }
      });
    },
    go() {
      this.$router.go(-1);
    }
  },
  created() {
    this.getTitle();
  }
};
</script>

<style scoped lang='scss'>
@import "@/assets/sass/common.scss";
@import "@/assets/sass/vw.scss";
header {
  display: flex;
  justify-content: space-between;
  background-color: #f5f5f5;

  .headerback img {
    width: vw(80);
    height: vw(100);
  }

  .indexsearch {
    width: vw(572);
    height: vw(100);
    // background-color: orange;
    font-size: 16px;
    text-align: center;
    line-height: vw(100);
  }
  .index img {
    width: vw(92);
    height: vw(100);
  }
}
</style>